import React from 'react';
import {IRouteComponentProps,NavLink} from "umi"
import styles from ".././index.less"
import "@/fonts/iconfont.css"
const MainLayout:React.FC<IRouteComponentProps>=function(props){
  const navlist=[
    {
      img:'iconfont icon-index',
      path:"/main/home",
      text:'首页'
    },
    {
      img:'iconfont icon-yinying',
      path:"/main/topic",
      text:'专题'
    },
    {
      img: 'iconfont icon-leimupinleifenleileibie',
      path:"/main/classify",
      text:'分类'
    },
    {
      img:'iconfont icon-che',
      path:"/main/cart",
      text:'购物车'
    },
    {
      img:'iconfont icon-wode',
      path:"/main/my",
      text:'我的'
    }
  ]
  return (
      <>
     <div className={styles.div}>
     <main className={styles.mains}>
      {props.children}
      </main>
    <footer className={styles.footers}>
        <ul>
          {
            navlist.map((item,index)=>{
              return <li key={index}>
                        <NavLink activeClassName={styles.active} to={item.path}>
                        <i className={item.img}></i>
                             {item.text}
                        </NavLink>
                     </li>
              })
          }
        </ul>
      </footer>
     </div>
      </>
  );
}
export default MainLayout